//#######################################################################################################################
//列头
var col_array=[
  {name: 'id', label: "学号"},
  {name: 'name', label: '姓名'},
  {name: 'gender', label: '性别'},
  {name: 'work', label: '岗位'},
  {name: 'grade', label: '成绩'},
]
//数据集置空
var data_array=[
]
//#######################################################################################################################
//页面加载完毕触发函数
$(document).ready(function(){
  //获取屏幕参数
  var window_height=window.screen.height;//屏幕高度
  var window_width=window.screen.width;//屏幕宽度

  //从服务器的mysql数据库中获取数据集
  data_array=get_data();


  //获取当前网页url
  var url=window.location.href

  //获取数据集长度
  var form_data_size=data_array.length

  //计算数据需要的页数
  var page_sum=(form_data_size%13)?(form_data_size/13+1):(form_data_size/13);

  //默认主页页码为1，若url中带有page=1之类的字串，则截取当前页的页码
  page=((url.split('=')).length==1)?1:parseInt(url.split('=')[1])

  //给定ZUI表格组件初始参数
  var my_form=$('#form').datagrid({
    //数据信息
    dataSource: 
    {
      //列头信息
      cols:col_array,
      //行（数据）信息
      array:data_array.slice((page-1)*13,page*13),
    },
    //高度信息
    height:36*14+13+'px',
  });

  //动态添加翻页按钮
  for(var i=1;i<=page_sum;i++)
  {
    //建立新的元素li
    var $new_li=$("<li></li>");
    //建立新的元素a（超链接），规定文字为i（页码）
    var $new_a=$("<a></a>").text(i)
    //向a添加属性class="paper-item"以及href="#page=页码"
    $new_a.attr("class","paper-item").attr("href","#page="+i)
    //向li元素添加属性page=页码
    $new_li.attr("page",parseInt(i))
    //把a元素添加进li元素
    $new_li.append($new_a);
    //向li元素添加click事件
    $new_li.click(function()
    {
      //获取当前页面号，默认为1
      var page_no=$(this).attr("page")
      //刷新表格数据（由ZUI默认方法，经网友分析，这样可以刷新）
      var newData=data_array.slice((page_no-1)*13,page_no*13)
      var dg = my_form.data("zui.datagrid");
      dg.resetData(dg.dataSource.dataId, newData);
      dg.renderData()
    })
    //向翻页按钮组添加按钮
    $("#paper_group").append($new_li)
    }
    
})
//##################################################################################################################################3
//getdata函数定义，用于获取服务器数据库的数据
var get_data=function(){
  //定义空数据集
  var new_array=[]
  //填写服务器post网址
  url="http://localhost:913/person_manage/HelloServlet"
  //用jquery的ajax进行post
  $.ajax({
    //定义通信方式为post
    type:'post',
    //定义服务器post网址
    url:url,
    //定义向服务器发送的请求头的body部分（数据部分）
    data:{"order":"get_data","verity":"accept"},
    //更改ajax通信为同步
    async :false,
    //post成功并接收到回复执行success函数
    success:function(res){
      //对接收到的json进行处理，把它仿照data_array的数据形式进行改写
      count=0
      for(var i in res)
      {
        //定义空字典
        dict={}
        //向字典里添加各种元素
        dict['id']=res[count].id;
        dict['name']=res[count].name;
        dict['gender']=res[count].gender;
        dict['work']=res[count].work;
        dict['grade']=res[count].grade;
        //逐次拼接new_array以获得新数据集
        new_array=new_array.concat(dict)
        count=count+1
      }
    },
    //post失败或没有接收到回复，执行error函数，打印请求失败
    error:function(){
      console.log("请求失败");
    },
    //定义上述data是json格式
    dataType:"json",
    //定义文本类型为utf-8，和其他参数（不是很重要）
    contentType: "application/x-www-form-urlencoded; charset=utf-8", 
  });
  //返回新数据集
  return new_array
}

